<template>
    <el-table :data="list" style="width: 100%">
      
      <el-table-column label="选择" width="55">
        <template #default="scope">
          <el-checkbox v-model="scope.row.state" size="large" @change="checkHandle(scope.$index)" 
          :disabled="show==!scope.row.state" />
        </template>
      </el-table-column>
      <el-table-column label="编号" width="150">
        <template #default="scope">{{ scope.row.id }}</template>
      </el-table-column>
      <el-table-column label="待办事项" width="200">
        <template #default="scope">{{ scope.row.content }}</template>
      </el-table-column>
      <el-table-column label="创建时间" width="150">
        <template #default="scope">{{ scope.row.startDate }}</template>
      </el-table-column>
      <el-table-column label="完成时间" width="120">
        <template #default="scope">{{ scope.row.finishDate }}</template>
      </el-table-column>
      <el-table-column align="right">
      <template #default="scope">
        <el-button
          size="small"
          type="danger"
          @click="handleDelete(scope.$index, scope.row)"
        >
          删除
        </el-button>
      </template>
    </el-table-column>
    </el-table>
  </template>

  <script>
  import { ElMessageBox } from 'element-plus';
  export default {
        data() {
          return {
            show:false,
            list1:this.list
          }
        },
        props:{list:Array},
        methods:{
          checkHandle(i){
                    ElMessageBox.confirm(
                        '确定任务已经完成了吗?',
                        'Warning',
                        {
                        confirmButtonText: '确定',
                        cancelButtonText: '点错了',
                        type: 'warning',
                        }
                      )
                        .then(() => {
                          this.$emit('finish',i)
                      })
                      .catch(() => {
                        this.$emit('cancer',i)
                          //this.list1[i].state = false
                      })
          },
          handleDelete(i){
            ElMessageBox.confirm(
                '确定要删除吗?',
                'Warning',
                {
                confirmButtonText: '确定',
                cancelButtonText: '不确定',
                type: 'warning',
                }
              )
                .then(() => {
                  this.$emit('del',i)
              })
              .catch(() => {
                
              })
          }
  }
  }
  </script>